<!DOCTYPE html>
<html>
<head>
    <meta http-equiv="Content-Type" content="text/html; charset=UTF-8"/>
    <title>提问_骡窝窝</title>
    <meta name="viewport"
          content="width=device-width,minimum-scale=1.0,maximum-scale=1.0,user-scalable=no,minimal-ui,viewport-fit=cover"/>
    <meta name="referrer" content="always"/>
    <link href="https://css.mafengwo.net/css/cv/mobile+css+head:mobile+css+ui^YVw^1550829726.css" rel="stylesheet"
          type="text/css"/>
    <link href="https://css.mafengwo.net/mobile/css/ask/ask.css?1550829726" rel="stylesheet" type="text/css"/>
    <meta charset="utf-8"/>
    <meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">
    <link rel="stylesheet" href="/js/bootstrap-4.1.1-dist/css/bootstrap.min.css">
    <script src="/js/jquery/jquery.min.js"></script>
    <script src="/js/bootstrap-4.1.1-dist/js/bootstrap.min.js"></script>
    <link rel="stylesheet" href="/css/font/css/font-awesome.min.css"/>
    <link rel="stylesheet" href="/css/reset.css"/>
    <link rel="stylesheet" href="/css/strategyCatalogs.css"/>
    <script src="/js/plugins/jrender/jrender.min.js"></script>
    <link rel="stylesheet" href="/js/plugins/dialog2/dialog.css"/>
    <script src="/js/plugins/dialog2/dialog.min.js"></script>
    <script src="/js/common.js"></script>
    <script src="/js/queryAndBlankComment.js"></script>
    <script src="/js/checkLogin.js"></script>
    <script src="/js/plugins/mdialog/mDialog.js"></script>
    <link rel="stylesheet" href="/css/dialog.css"/>
    <link rel="stylesheet" href="/css/myStrategyComment.css"/>
    <link rel="stylesheet" href="/js/bootstrap-3.3.7-dist/css/bootstrap.css">
    <!--用于上传图片表单-->
    <script src="/js/plugins/form/jquery.form.js"></script>
    <script>
        $(function () {
            var div;//图片区
            $(".img .rect").click(function () {
                div = this;
                $("#fileInput").click();
            });
            //图片的表单值发生改变时
            $('#fileInput').change(function () {
                if ($(this).val()) {
                    $('#imageForm').ajaxSubmit({
                        url: baseUrl + '/images',
                        success: function (data) {
                            if (data.status == 1) {
                                $(div).html('<img src="' + data.url + '">');
                            }
                        }
                    })
                }
            });
            //获取所有的地区
            $.get(baseUrl + '/regions',function (data) {
                var temp;
                $.each(data,function (index, ele) {
                    temp += "<option value='"+ele.id+"'>"+ele.name+"</option>";
                })
                $("#regions").append(temp);
            })

            //点击发布问题
            $("#submitBtn").click(function () {
                var img = $(".rect img").attr("src");
                var content = $("#content").val();
                var userId = user.id;
                var regionId = $("#regions").val();
                var question = {
                    imgUrl:img,
                    content:content,
                    "user.id":userId,
                    "region.id":regionId
                }
                $.post(baseUrl + '/questions', question, function (data) {
                    if(data.success){
                        $(document).dialog({
                            autoClose: 2000,
                            content: '发布成功',
                        });
                        setTimeout(function () {
                           window.location.href="/question.html"
                        }, 100);
                    } else{
                        $(document).dialog({
                            autoClose: 1500,
                            content: data.errorMsg,
                        });
                    }
                })
            });
        })
    </script>


</head>
<body>
<div id="pos38"></div>
<header class="head2home">
    <div class="col">
        <a href="javascript:history.go(-1);">
            <span class="glyphicon glyphicon-chevron-left"></span>
        </a>
    </div>

    <div class="rBtn">
        <a href="/" class="home glyphicon glyphicon-home">窝窝首页</a>
    </div>
</header>
<!--图片输入-->
<form id="imageForm" method="post">
    <input type="file" name="file" id="fileInput" hidden/>
</form>
<div class="comment">
    <div class="container tag">
        <dt class="glyphicon glyphicon-question-sign">问题:</dt>
        <textarea id="content" class="form-control" rows="5" placeholder="请填写你的提问"></textarea>
    </div>
    <hr/>
    <div class="container img">
        <dt class="glyphicon glyphicon-upload">上传图片</dt>
        <div class="row">
            <div class="col-3 rect">
                <span class="glyphicon glyphicon-folder-open"></span>
            </div>
        </div>
    </div>
    <div class="container regions">
        <dt>选择地区</dt>
        <select name="region" id="regions"value="-1">
            <option value="-1">地球</option>
        </select>
    </div>
</div>
<div class="operation">
    <button class="btn-info" id="submitBtn">发布问题</button>
</div>
</body>
</html>
